<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="utf-8" />
	<link rel="stylesheet" href="../../lib/jstree1/themes/default/style.min.css" />
	<script type="text/javascript" src="../../lib/jstree1/jstree.js"></script>


	<script type="text/javascript">
		$(document).ready(function() {
		                            $("#holder-parent").hide();
		                           CourseCreationController.initialize();
		                            $("#closeForm").on("click",function() {
		                                $("#form-holder").empty();
		                                $("#holder-parent").hide();
		                                
		                            });    
		                        });
	</script>

	<script id="courseoffering-details-nav-tmpl" type="text/x-handlebars-template">
		<ul><li id="{{code}}" type="CourseOffering">
		                        {{title}}
		                        {{#if lessons}}
		                        <ul>
		                        {{#each lessons}}
		                        <li type="Lesson" data-name="{{name}}">
		                        {{title}}
		                        {{>units-recursion}}
		                        </li>
		                        {{/each}}
		                        </ul>
		                        {{/if}}
		                        </li>
		                        </ul>
	</script>

	<script id="units-recursion-partial" type="text/x-handlebars-template">
		{{#if units}}
		                        <ul>
		                        {{#each units}}
		                        <li type="Unit" data-name="{{title}}" >
		                        {{title}}
		                        {{>units-recursion}}
		                        </li>
		                        {{/each}}
		                        </ul>
		                        {{/if}}
	</script>

</head>

<body>
	<div id="actions">
		<div class="btn-group" style="padding:10px;margin:20px">
			<button class="btn btn-success action" id="add">Add</button>
			<button class="btn btn-info action" id="edit">Edit</button>
			<button class="btn btn-danger action" id="delete">Delete</button>
		</div>
	</div>
	<div id="treecontainer">
		<div id="jstree">
			<ul>
				<li id="1" type="CourseOffering">Course Offering 1</li>
			</ul>
		</div>
	</div>
	<div id="holder-parent" style="margin-top:10px">
		<div class="pull-right" style="padding-right:5px">
			<button type="button" id="closeForm" class="close" data-dismiss="modal" aria-hidden="true">x</button>
		</div>
		<div id="form-holder">
		</div>
	</div>
</body>

</html>
